<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Identi Engine - Identities API Demo</title>

<link rel="stylesheet" href="../css/site.css" type="text/css" media="all" />
<link rel="stylesheet" href="../css/demos.css" type="text/css" media="all" />
<link rel="stylesheet" href="../css/demo-identity-discovery.css" type="text/css" media="all" />
<link rel="shortcut icon" href="../images/logo16.png"/>	

<script language="javascript" type="text/javascript" src="../ident/jquery-1.3.2.min.js"></script>
<script language="javascript" type="text/javascript" src="../ident/web-address.min.js"></script>

<link type="application/rss+xml" rel="alternate" title="Ident Engine (RSS)" href="http://identengine.com/Blog/syndication.axd?format=rss" />
<link type="application/atom+xml" rel="alternate" title="Ident Engine (ATOM)" href="http://identengine.com/Blog/syndication.axd?format=atom" />

<script language="javascript" type="text/javascript">

     /*
     *  Copyright 2009, Glenn Jones
     *  Licensed under the MIT license.
     *  http://identengine.com/license/
     *  More information: http://identengine.com/
     */

   
    // Page render functions
    // -------------------------------------------------

    // Adds click event to form when page loads
    var doc = jQuery(document);
    doc.ready(function () {
         
		// Start animation of different input options    
        webAddress.elt = "#webaddress";
        webAddress.startAnimate();
        
        // Adds onclick event to form button
        jQuery("#subbutton").click(function () {
        	startDemo()            
        });
        
        // Add on enter keyup event
        jQuery("#urlinput").keyup(function(e) {
			if(e.keyCode == 13) {
				startDemo();
			}
		}); 
        
        
     });  
     
     function startDemo(){
     	
        resetContent();
    	webAddress.stopAnimate();    
    
    	// Add search header and spinning icon
      	jQuery('<h2 id="search-heading">Searching for your profiles</h2>').appendTo('#results');
    	jQuery('<div id="searching"><img class="spinner" src="../images/ajax-loader.gif" /> Looking across the web to find your profiles.</div>').appendTo('#results');
        
        // Get the url the user input
        var url = jQuery("#urlinput").attr("value");
        
        // Build the YQL query and apiCall
         var query = 'use "http://identengine.com/opentables/identities.xml";select * from identities where urls="' + url + '" and useInwardEdges=1 and endPoints=0 and iconPath="";';      
         var apiCall = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent( query ) + '&format=json&diagnostics=false';
           
        // Use jQuery to get JSON and call renderIdentities function
        jQuery.getJSON(apiCall + "&callback=?", function(json){
            renderIdentities( json );
        });
        
     }
     
    
     function renderIdentities(json){
         resetContent();
         
         if(json.query){
         	if(json.query.results){
         		if(json.query.results.identities){
         			if(json.query.results.identities.count){
         				var ul = jQuery('<ul class="profile-list"></ul>').appendTo('#identities'); 
         				for (var x = 0; x < json.query.results.identities.count; x++) {
         					var identity = json.query.results.identities.identity[x];
                    		jQuery('<li class="floatclear"><a href="' + identity.profileUrl  + '"><div class="icon ' + identity.spriteClass +  '"></div> <span class="icon-label">' + identity.name + '</span></a>&nbsp;<span class="username">(' + identity.username + ')</span></li>').appendTo(ul);   
         				}
         			}
         		}
         	}	
         }
                  
     }

    // Clear the html
    function resetContent(){
        jQuery('#identities').html('');
        jQuery('#search-heading').html("");
        jQuery('#searching').html("");
    }
    





</script>

</head>

<body>


	<div class="header">
		<div class="centered">
			<a href="http://identengine.com/"><h1><span>Ident Engine</span></h1></a>
			<h2 id="strapline"><span>A JavaScript library that retrieves and aggregates profiles from across the web</span></h2>
		</div>
	</div>

	<div class="content">
		<div class="centered">
		<div class="floatclear" style="clear:both">
			<ul class="menu">
				<li><a href="index.htm" class="firstItem">home</a></li>
				<li><a href="documentation/index.htm">documentation</a></li>
				<li><a href="index.htm">api</a></li>
				<li><a href="http://identengine.com/blog/">blog</a></li>
				<li><a href="about/index.htm" class="lastItem">about</a></li>
			</ul>
		</div>	


	
		<h1>Identities API Demo</h1>
		
		<noscript id="no-javascript-error"><h2 class="error">Sorry but you need to have JavaScript running to use this demo</h2></noscript>

		<p class="form-text">Please enter the web address of a profile page. This could be on Twitter, 
		FriendsFeed, Flickr, Digg or any other web profile page.</p>
		
		<div class="demo-form">
			<label for="urlinput">Web address</label>&nbsp;<input id="urlinput" name="url" value="http://friendfeed.com/glennjones" size=50 type="text" />&nbsp;
			<a id="subbutton" class="button">Find</a>
			<div id="webaddress"></div>
		</div>
		
		<div id="results"></div>
		<div class="floatclear" style="clear:both">
			<div id="identities"></div>
		</div>
		
				
				</div>
	</div>
	

	

    <div class="footer">
		<div class="centered">
		
		<div class="copyright">© Copyright Glenn Jones 2009. All Rights Reserved.</div>
		
		</div>
	</div>

		
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-3021774-6");
pageTracker._trackPageview();
} catch(err) {}</script>		

</body>
</html>
